<extend name="Base/common"/>
 
<block name="header">
<link href="__CSS__/marketing.css" rel="stylesheet">
<php>if(!is_weixin()){</php>
{:hook('mobileTopNav',array('title'=>$meta_title))}
<php>}else{</php>
  <header class="bar bar-nav">
    <a href="{:U('/')}" class="logo"><img src="{:get_cover(C('WAP_LOGO'),'path')}" height="34" alt="{:C('WEB_SITE_TITLE')}"></a>
    <span class="nav-invite">客服：<a class="text-danger" href="TEL:{:C('WEB_SITE_TEL')}">{:C('WEB_SITE_TEL')}</a></span>
  </header>
<php>}</php>
</block>

<block name="body">
  <!-- 商品图片幻灯 -->
  <notempty name="data.images_list">
    <div class="slider">
      <div class="slide-group">
        <volist name="data.images_list" id="vo">
          <div class="slide">
            <img src="{$vo.path}">
          </div>
        </volist>
      </div>
      <ol class="slider-indicators">
        <volist name="data.images_list" id="vo">
          <li></li>
        </volist>
      </ol>
    </div>
  <else/>
    <i class="icon"></i>
    <p class="tips">暂无图片</p>
  </notempty>

  <!-- 商品名称、价格、收藏 -->
  <div class="item-info">
    <h4 class="name">{$data.name} <notempty name="data.subname"><span class="subname text-danger">{$data.subname}</span></notempty></h4>
    <!-- 商品价格 -->
    <div class="price-box">
      <span class="text-danger">
        <span class="yen">&yen;</span><em class="price Z_spec_price">{$data.price}</em>
      </span>
      <del>{$data['join']['join_num']?:0}人团<!--<span class="yen">&yen;</span>{$data.mprice}--></del>
        <del style="display:block;margin:5px 0 0;">单卖价：<span class="yen">&yen;{$data.mprice}</span></del>
    </div>
    <!-- 加入收藏 -->
    <div class="fav-box">
      <a href="javascript:;" id="Z_item_{$data.id}" data-id="{$data.id}" class="fav <eq name="data.is_fav" value="1">has-fav</eq> Z_add_fav"><i class="icon <eq name="data.is_fav" value="1">icon-like-fill<else/>icon-like</eq>"></i></a>
    </div>
    <!-- 运费 -->
    <div>
      由 {$data['store_name']|default='平台'} 发货并提供售后服务<span class="delivery_free text-danger">
    <php>$a_pr = get_store_free_amount($data['store_id']);</php>
    <gt name="a_pr" value="0">
        （满{$data.store_id|get_store_free_amount}元包邮）
        <else />
        {$data.id|get_store_item_freight}
    </gt>
</span><br />
     
    </div>
  </div>
  
  <notempty name="data.send_item">
    <!-- 赠品 -->
    <div class="send-item">
      <span class="send-item-tip">
        <gt name="data.send_min_num" value="1">
        买{$data.send_min_num}件赠送
        <else/>
        赠品
        </gt>
      </span>
      <volist name="data.send_item" id="vv">
        <span class="send-item-span"><a href="{:U('/Item/detail?id='.$vv['id'])}"><img src="{:get_image_thumb($vv['item_info']['thumb'], 100, 100)}" title="{$vv.item_info.name} × {$vv.num}" alt="{$vv.item_info.name} × {$vv.num}"/></a></span>
      </volist>
    </div>
  </notempty>
  
  <notempty name="data.SecondPieces">
    <!-- 第二件折扣  
    <div class="">
      {$data.SecondPieces.name}
    </div> -->
  </notempty>
  
  <input type="hidden" id="Z_item_id" name="item_id" value="{$data.id}">
  <input type="hidden" id="Z_item_stock" name="stock" value="{$data.stock}">
  <input type="hidden" id="Z_item_image" name="item_image" value="{$data.cover_path}">
  <input type="hidden" id="Z_item_price" name="price" value="{$data.price}"> 
  <input type="hidden" id="Z_item_spec" name="specifiction"  value="">
  <input type="hidden" id="Z_item_code" name="item_code" value="{$data.number}">
 

  <!-- 商品数量选择 --> 

  <div class="item-num">
    <php>$quota_num = $data['quota_num'] > 0 ? $data['quota_num'] : $data['stock'];</php>
    <notempty name="data.property.property_specifiction">
      <a href="#Z_spec_info" id="Z_select_spec" class="btn btn-block btn-spec">选择：规格、数量<i class="icon icon-arrow-right"></i></a>
    <else/>
      <!-- 购买数量选择 -->
      <h4>选数量 
        <notempty name="data.quota_num">
          <span class="quota-tip">（{$data.id|quota_text}限购 <span class="text-danger Z_quota_num">{$data.quota_num}</span> 件）</span>
        </notempty>
      </h4>
      <div class="num" <notempty name="data.quota_num"> style="float:inherit;margin-bottom:10px;" </notempty>>
        <a href="javascript:;" class="minus disabled Z_quantity_act" data-option="minus"><i class="icon">&minus;</i></a>
        <input id="Z_item_quantity" type="number" value="1" pattern="[0-9]*" min="1" max="{:min($data['stock'], $quota_num)}" required="">
        <a href="javascript:;" class="plus Z_quantity_act {$quota_num==1? 'disabled': ''}" data-option="plus"><i class="icon">&plus;</i></a>
        <em id="J_EmStock" class="tb-hidden">库存<i class="Z_spec_quantity">{$data.stock}</i>件</em>
      </div>
    </notempty>
  </div>

  <!-- 已购买数量和已收藏数量 -->
  <div class="item-count" id="Z_buy_box">
    <ul class="flex-box info">
      <if condition="C('IS_SHOW_BUYNUM')">
        <li>
          <i class="icon icon-cart-fill"></i><em>{$data['buynum']}人已购买</em>
        </li>
      </if>
      <li>
        <i class="icon icon-like-fill"></i><em>{$data['favnum']}人已收藏</em>
      </li>
    </ul>
  </div>
    <!--<拼团规则-->
    <div class="puzzle-rule">
        <h1>拼团规则<span id="pt-rule">详细规则</span></h1>
        <ul>
            <li><span>1</span><label>选择心仪团购商品</label></li>
            <li><span>2</span><label>支付拼团或参团</label></li>
            <li><span>3</span><label>邀请好友参团</label></li>
            <li><span>4</span><label>达团购数拼团成功</label></li>
        </ul>
        <div class="rule-produce">人数不足自动退款，详见上方详细规则</div>
    </div>
    <!--参团-->
<notempty name='joinlist'>
  <volist name='joinlist' id='vo'>
    <div class="offer">
        <div class="offer-head">
            <img src="{$vo.reg_uid|getAvatar}" />
            <span class="name-address" style="top: 0px;">
                {$vo.reg_uid|get_nickname}
                
            </span>
            <span style="position: absolute;top: 25px;left: 70px; display: inline-block;width: 100px; color: #333;font-size: 14px;">{$vo.ship_area|partarr}</span>
        </div>
        <a style="cursor: pointer;" href="javascript:void(0);" val='{$vo.id}' class="J_join_buy1 psd">参团</a>
        <label>差
        <php>  echo $vo['num'] - joincount($vo['id']);</php>
        人成团</label>
        <span class="terminal-time mytime{$key}" val='{$vo.etime}'>
       <!--  倒计时： -->
        <span class='day'>0</span>天
        <span class='hour'>0</span>小时
        <span class='minute'>0</span>分钟
        <span class='second'>0</span>秒
        </span>
    </div>
  </volist>
    <else />
  <p>暂无开团</p>
</notempty>

<input type="hidden" id="J_item_id1" >
<input type="hidden" id="J_item_price1"">
<input type="hidden" id="J_item_joinid1" >
<input type="hidden" id="J_item_spec1" >
<input type="hidden" id="J_item_code1" > 
<input type="hidden" id="J_item_quantity1" value="1">
  <!-- 商品参数 -->
  <!-- <notempty name="data.property.property_attribute">
    <div class="item-param">
      <h4>商品参数</h4>
      <ul>
        <volist name="data.property.property_attribute" id="prp">
          <li>
          <notempty name="prp['info'][0]"><span>{$prp.cname}：</span></notempty>
          <notempty name="prp.info">
            <volist name="prp.info" id="val">
              <in name="prp.formtype" value="input,textarea">
                {$val}
              <else/>
                <eq name="prp.formtype" value="color">
                  <notempty name="val.item_pic">
                    <img src="{$val.item_pic}" alt="{$val['option']}" title="{$val['option']}" class="item_pic" />
                  <else/>
                    <notempty name="val.pic">
                      <img src="__ROOT__{$val.pic|get_cover='path'}" alt="{$val['option']}" title="{$val['option']}" />
                    <else/>
                      <i style="background:{$val['color']}"></i>
                    </notempty>
                  </notempty>
                </eq>
                <eq name="prp.formtype" value="image">
                  <img src="__ROOT__{$val.pic|get_cover='path'}" alt="{$val['option']}" title="{$val['option']}" />
                </eq>
                {$val['option']}&nbsp;
              </in>
            </volist>
          </notempty>
          </li>
        </volist>
      </ul>
    </div>
  </notempty> -->

  <!-- 商品详细信息 -->
  <div class="item-intro"> 
    
      <h4>商品详情</h4>
    <div class="images">{$data['intro']}</div>
  </div>
   
  <!-- 用户评价 -->
  <div class="item-comment">
    <h4>用户评价</h4>
    <div class="comment">
      <notempty name="data.comment">
        <ul>
          <volist name="data.comment" id="vo">
            <li>
              <div class="article">
                <strong>
                  <if condition="$vo['Member']">
                    {$vo.Member.nickname|get_hidden_mobile}
                  <else />
                    {$vo.nickname}
                  </if>
                </strong>
                <small class="text-info">{$vo.create_time|time_format}</small>
                <div class="info">
                  {$vo.content}
                  <notempty name="vo.reply">
                    <div class="reply">
                      <div class="avatar">
                        <img class="media-object pull-left img-circle" src="__IMG__/logo-avatar.png" width="50" onerror="this.src='__IMG__/thumbnail.png'">
                      </div>
                      <div class="info">
                        <strong>回复</strong>
                        <small class="text-info">{$vo.reply.create_time|time_format}</small>
                        <p>{$vo.reply.content}</p>
                      </div>
                    </div>
                  </notempty>
                </div>
              </div>
              <div class="avatar">
                <if condition="$vo['Member']">
                  <img src="<notempty name="vo.Member.avatar">{:get_image_thumb($vo['Member']['avatar'], 120, 120)}<else/>__IMG__/avatar-default.png</notempty>" width="50" />
                <else />
                  <img src="<notempty name="vo.image">{:get_image_thumb(get_cover($vo['image'], 'path'), 120, 120)}<else/>__IMG__/avatar-default.png</notempty>" width="50">
                </if>
              </div>
            </li>
          </volist>
        </ul>
      <else/>
        <p>暂时没有用户评价！</p>
      </notempty>
    </div>
  </div>

  <!-- 返回首页浮动层 -->
  <a href="{:U('/')}" class="item-home-fixed"><i class="icon icon-home"></i></a>
</block>

<!-- 商品规格选择 -->
<block name="extend">
  <!-- 放到底部防止content z-index导致遮罩遮挡的bug -->
  <div id="Z_spec_info" class="modal modal-spec">
    <header class="bar bar-nav">
      <a class="pull-right" href="#Z_spec_info"><i class="icon icon-close"></i></a>
      <h1 class="title">选择规格和数量</h1>
    </header>

    <div class="content content-padded">
      <div class="select-info">
        <span id="Z_selected_info" class="pull-left">请您选择规格</span>
        <span class="pull-right text-danger">
          <span class="yen">&yen;</span>
          <em class="price Z_spec_price">{$data.price}</em>
        </span>
      </div>
      <notempty name="data.property.property_specifiction">
        <div class="pro-spc" id="Z_item_spc">
          <!-- 规格选择 -->
          <volist name="data.property.property_specifiction" id="spc" key="spc_key">
            <div class="spec-box">
              <h3>选{$spc.cname}</h3>
              <dl class="sku-box Z_sku_box">
                <notempty name="spc.info">
                  <dd>
                    <ul class="Z_spec_item <in name='spc.formtype' value='checkbox'>text</in> <in name="spc.formtype" value="color,image">color</in>">
                      <volist name="spc.info" id="val" mod="3">
                        <li title="{$val.option}" class="choose Z_sale_porp" data-key="{$spc_key}" data-code="{$val.code}" args="key[{$val['code']}]={$spc.cname}&val[{$val['code']}]={$val['option']}&code[{$spc_key}]={$val['code']}">
                          <a href="javascript:;">
                            <switch name="spc.formtype">
                              <case value="color">
                                <notempty name="val.item_pic">
                                  <img src="__ROOT__{:get_image_thumb($val['item_pic'], 100, 100)}" alt="{$val.option}" title="{$val.option}" class="item_pic" onclick="javacript:item.switchPic(this.src);" />
                                <else/>
                                  <notempty name="val.pic">
                                    <img src="__ROOT__{$val.pic|get_cover='path'}" alt="{$val.option}" title="{$val.option}" />
                                  <else/>
                                    <i style="background:{$val.color}"></i>
                                  </notempty>
                                </notempty>
                              </case>
                              <case value="image">
                                <img src="__ROOT__{$val.pic|get_cover='path'}" alt="{$val.option}" title="{$val.option}" />
                              </case>
                              <default />{$val.option}
                            </switch>
                            <span class="triangle">已选中</span>
                          </a>
                          <span class="option">{$val.option}</span>
                        </li>
                      </volist>
                    </ul>
                  </dd>
                </notempty>
              </dl>
            </div>
          </volist>
          <notempty name="data.quota_num">
            <div class="select-info">
              <span class="pull-left">
                 当前商品{$data.id|quota_text}限购 <span class="text-danger Z_quota_num">{$data.quota_num}</span> 件
              </span>
            </div>
          </notempty>
          <!-- 数量选择 -->
          <!-- <div class="spec-box-num">
            <h3>选数量</h3>
            <div class="num">
              <a href="javascript:;" class="minus disabled Z_quantity_act" data-option="minus"><i class="icon">&minus;</i></a>
             
              <a href="javascript:;" class="plus Z_quantity_act {$quota_num ==1 ? 'disabled' : ''}" data-option="plus"><i class="icon">&plus;</i></a>
              <em id="J_EmStock" class="tb-hidden">库存<i class="Z_spec_stock">{$data.stock}</i>件</em>
            </div>
          </div> -->
           <input id="Z_item_quantity" type="hidden" value="1" min="1" >
          <a id="Z_spec_submit" class="btn btn-block btn-positive">确定</a>
          <a href="#Z_spec_info" class="btn btn-block">取消</a>
        </div>
      </notempty>
    </div>
  </div>
</block>
<style>
  /*.item-act > span {
      width: 50% !important;
  }*/

  .item-act .cart-fixed, .item-home-fixed {
      width: 44px;
      box-shadow: 0 0 5px #ddd;
      text-align: center;
  }

  .item-act > span > .btn-tab .icon {
      margin-right: 5px;
      font-size: 18px;
  }
</style>
<block name="footer">
  <div class="bar bar-tab item-act">
      <gt name="data.stock" value="0">
        <span class="pull-left" style="width:50%">
          <a href="{:U('/Item/detail',array('id' => $data['id']))}" class="btn btn-block  btn-tab" id="Z_quick_buy" style="font-size: 80%;">
         &yen;{$data.mprice}
          <br />
          <!-- <i class="icon icon-recharge"></i> -->单独购买</a>
        </span>
        <span class="pull-right" style="width:50%">
          <a href="javascript:;" class="btn btn-block btn-negative btn-tab J_join_buy" style="font-size: 80%;">
       <em class='heihei'>&yen;{$data.price}</em>
         
          
         <br />
          <!-- <i class="icon icon-cart"></i> -->
          立即开团({$data['join']['join_num']?:0}人团)</a>
        </span>
      <else/>
        <span class="pull-left">
          <a href="javascript:;" class="btn btn-block btn-positive btn-tab disabled"><i class="icon icon-recharge" style="margin-right: 8px;font-size: 20px;top:0"></i>卖光</a>
        </span>
        <span class="pull-right">
          <a href="{:U('/Item/search')}" class="btn btn-block btn-tab"><i class="icon icon-cart" style="margin-right: 8px;font-size: 20px;top:0"></i>其它</a>
        </span>
      </gt>
                  
  
    <a href="{:U('Cart/index')}" class="cart-fixed"><i class="icon icon-cart"></i><em class="num {$user_count['cart_count'] > 0 ? '' :'hide'}" id="Z_global_cart_quantity">{$user_count['cart_count']|default=0}</em></a>
  </div>
</block>

<block name="script">
  <script type="text/javascript">
  // window.onload=function(){
  //   $('#Z_item_spc .spec-box').each(function(){
  //       $(this).find('ul li').first().click();
  //   });
   
  // }

    //规格组合对应的价格，数量值数组
    var spc_data_info = null;
   <notempty name="data.property.spc_data">
          spc_data_info = '{$data.property.spc_data}';
    </notempty>
    seajs.use(['join'], function(join){
       join.init(spc_data_info);
        $('.offer').each(function(ele){
          join.showtime(this ,'.mytime'+ele);
        });
        $('#pt-rule').on('click',function(){
          var domain = "{:SITE_URL}";
          var aid = "{$aid}";
          window.location.href= domain+'/Article/detail/id/'+aid+'.html';
        });
    });
    
  </script>
</block>